<template>
  <el-drawer
    :title="title"
    size="auto"
    :wrapperClosable="false"
    :visible.sync="isShow"
    direction="rtl"
    class="company-detail"
    @close="closeDrawer"
    >
    <div class="drawer-body">
      <el-scrollbar style="height:100%">
        <el-form size="small">
          <el-row :gutter="20">
            <el-col :xs="24">
              <h3 class="align-center">基本信息</h3>
            </el-col>
            <el-col :xs="24">
            <el-form-item label="污染源名称：" required>
              <el-input v-model="form.name" placeholder="请输入" :readonly="type == 'view'" />
            </el-form-item>
            </el-col>
            <el-col :xs="24" :sm="12">
            <el-form-item label="污染源类别：">
              <el-input v-model="form.class" placeholder="请输入" :readonly="type == 'view'" :disabled="type != 'view'"/>
            </el-form-item>
            </el-col>
            <el-col :xs="24" :sm="12">
            <el-form-item label="统一社会信用代码：">
              <el-input v-model="form.code" placeholder="请输入" :readonly="type == 'view'" />
            </el-form-item>
            </el-col>
            <el-col :xs="24" :sm="12">
            <el-form-item label="企业联系人：">
              <el-input v-model="form.contact" placeholder="请输入" :readonly="type == 'view'" />
            </el-form-item>
            </el-col>
            <el-col :xs="24" :sm="12">
            <el-form-item label="联系人电话：">
              <el-input v-model="form.telephone" placeholder="请输入" :readonly="type == 'view'" />
            </el-form-item>
            </el-col>
            <el-col :xs="24">
            <el-form-item label="企业地址：">
              <el-input v-model="form.address" placeholder="请输入" :readonly="type == 'view'" />
            </el-form-item>
            </el-col>
            <el-col :xs="24" :sm="12">
            <el-form-item label="经度[113-115]：" required>
              <el-input v-model="form.lon" placeholder="请输入" :readonly="type == 'view'" />
            </el-form-item>
            </el-col>
            <el-col :xs="24" :sm="12">
            <el-form-item label="纬度[21-23]：" required>
              <el-input v-model="form.lat" placeholder="请输入" :readonly="type == 'view'" />
            </el-form-item>
            </el-col>
            <el-col :xs="24" :sm="12">
            <el-form-item label="所属区县：" required :class="'form-'+type">
              <el-select v-model="form.county" placeholder="请输入" :readonly="type == 'view'" style="width:100%">
                <el-option v-for="(item,index) in initData.countys" :key="index" :label="item.name" :value="item.name"></el-option>
              </el-select>
            </el-form-item>
            </el-col>
            <el-col :xs="24" :sm="12">
            <el-form-item label="所属镇街：">
              <el-input v-model="form.town" placeholder="请输入" :readonly="type == 'view'" />
            </el-form-item>
            </el-col>
            <el-col :xs="24" :sm="12">
            <el-form-item label="国民经济行业类型（2级）：">
              <div slot="label">
                <el-tooltip class="item" effect="dark" content="根据四级代码生成" placement="top-start">
                  <i class="el-icon-warning-outline"></i>
                </el-tooltip>
                国民经济行业类型（2级）：
              </div>
              <el-input v-model="form.indtype_level2" placeholder="请输入" :readonly="type == 'view'" :disabled="type != 'view'" />
            </el-form-item>
            </el-col>
            <el-col :xs="24" :sm="12">
            <el-form-item label="国民经济行业代码（2级）：">
              <div slot="label">
                <el-tooltip class="item" effect="dark" content="根据四级代码生成" placement="top-start">
                  <i class="el-icon-warning-outline"></i>
                </el-tooltip>
                国民经济行业代码（2级）：
              </div>
              <el-input v-model="form.indcode_level2" placeholder="请输入" :readonly="type == 'view'" :disabled="type != 'view'" />
            </el-form-item>
            </el-col>
            <el-col :xs="24" :sm="12">
            <el-form-item label="国民经济行业类型（4级）：" required :class="'form-'+type">
              <treeselect
                :options="initData.industriesTree"
                v-model="indLabel"
                :disable-branch-nodes="true"
                :show-count="false"
                @select="selectType"
                placeholder="请选择"
                />
            </el-form-item>
            </el-col>
            <el-col :xs="24" :sm="12">
            <el-form-item label="国民经济行业代码（4级）：">
              <el-input v-model="form.indcode_level4" placeholder="请输入" :readonly="type == 'view'" :disabled="type != 'view'" />
            </el-form-item>
            </el-col>
            <el-col :xs="24">
              <h3 class="align-center">排放信息</h3>
            </el-col>
            <el-col :xs="24" :sm="12">
            <el-form-item label="VOCs绩效等级：">
              <el-input v-model="form.voc_level" placeholder="请输入" :readonly="type == 'view'" />
            </el-form-item>
            </el-col>
            <el-col :xs="24" :sm="12">
            <el-form-item label="炉窑绩效等级：">
              <el-input v-model="form.furnace_level" placeholder="请输入" :readonly="type == 'view'" />
            </el-form-item>
            </el-col>
            <el-col :xs="24" :sm="12">
            <el-form-item label="企业类型：">
              <el-input v-model="form.ent_type" placeholder="请输入" :readonly="type == 'view'" />
            </el-form-item>
            </el-col>
            <el-col :xs="24" :sm="12">
            <el-form-item label="集气方式：">
              <el-input v-model="form.collection_type" placeholder="请输入" :readonly="type == 'view'" />
            </el-form-item>
            </el-col>
            <el-col :xs="24" :sm="12">
            <el-form-item label="脱硫工艺：">
              <el-input v-model="form.so2_tech" placeholder="请输入" :readonly="type == 'view'" />
            </el-form-item>
            </el-col>
            <el-col :xs="24" :sm="12">
            <el-form-item label="脱硝工艺：">
              <el-input v-model="form.nox_tech" placeholder="请输入" :readonly="type == 'view'" />
            </el-form-item>
            </el-col>
            <el-col :xs="24" :sm="12">
            <el-form-item label="除尘工艺：">
              <el-input v-model="form.pm_tech" placeholder="请输入" :readonly="type == 'view'" />
            </el-form-item>
            </el-col>
            <el-col :xs="24" :sm="12">
            <el-form-item label="除VOCs工艺：">
              <el-input v-model="form.vocs_tech" placeholder="请输入" :readonly="type == 'view'" />
            </el-form-item>
            </el-col>
            <el-col :xs="24" :sm="12">
            <el-form-item label="VOCs工艺：">
              <el-input v-model="form.vocs_type" placeholder="请输入" :readonly="type == 'view'" />
            </el-form-item>
            </el-col>
            <el-col :xs="24" :sm="12">
            <el-form-item label="炉窑/锅炉的规模（t/h）：">
              <el-input v-model="form['scale_furnace/boiler']" placeholder="请输入" :readonly="type == 'view'" />
            </el-form-item>
            </el-col>
            <el-col :xs="24" :sm="12">
            <el-form-item label="炉窑/锅炉的数量：">
              <el-input v-model="form['num_furnace/boiler']" placeholder="请输入" :readonly="type == 'view'" />
            </el-form-item>
            </el-col>
            <el-col :xs="24" :sm="12">
            <el-form-item label="VOCs工艺/生产线的数量：">
              <el-input v-model="form.capacity_num" placeholder="请输入" :readonly="type == 'view'" />
            </el-form-item>
            </el-col>
            <el-col :xs="24" :sm="12">
            <el-form-item label="烟囱高度（m）：">
              <el-input v-model="form.chimney_height" placeholder="请输入" :readonly="type == 'view'" />
            </el-form-item>
            </el-col>
            <el-col :xs="24" :sm="12">
            <el-form-item label="烟囱直径（m）：">
              <el-input v-model="form.chimney_diameter" placeholder="请输入" :readonly="type == 'view'" />
            </el-form-item>
            </el-col>
            <el-col :xs="24" :sm="12">
            <el-form-item label="SO₂年排放量（吨）：">
              <el-input v-model="form.so2" placeholder="请输入" :readonly="type == 'view'" />
            </el-form-item>
            </el-col>
            <el-col :xs="24" :sm="12">
            <el-form-item label="NOx年排放量（吨）：">
              <el-input v-model="form.nox" placeholder="请输入" :readonly="type == 'view'" />
            </el-form-item>
            </el-col>
            <el-col :xs="24" :sm="12">
            <el-form-item label="VOCs年排放量（吨）：">
              <el-input v-model="form.vocs" placeholder="请输入" :readonly="type == 'view'" />
            </el-form-item>
            </el-col>
            <el-col :xs="24" :sm="12">
            <el-form-item label="PM₁₀年排放量（吨）：">
              <el-input v-model="form.pm10" placeholder="请输入" :readonly="type == 'view'" />
            </el-form-item>
            </el-col>
            <el-col :xs="24" :sm="12">
            <el-form-item label="PM₂.₅年排放量（吨）：">
              <el-input v-model="form.pm25" placeholder="请输入" :readonly="type == 'view'" />
            </el-form-item>
            </el-col>
            <el-col :xs="24">
              <h3 class="align-center">污染应对措施</h3>
            </el-col>
            <el-col :xs="24">
            <el-form-item label="Ⅱ级应对措施_PM：">
              <el-input v-model="form.measures2_pm" placeholder="请输入" :readonly="type == 'view'" type="textarea" />
            </el-form-item>
            </el-col>
            <el-col :xs="24">
            <el-form-item label="Ⅱ级应对措施_NOx：">
              <el-input v-model="form.measures2_nox" placeholder="请输入" :readonly="type == 'view'" type="textarea" />
            </el-form-item>
            </el-col>
            <el-col :xs="24">
            <el-form-item label="Ⅱ级应对措施_O₃：">
              <el-input v-model="form.measures2_o3" placeholder="请输入" :readonly="type == 'view'" type="textarea" />
            </el-form-item>
            </el-col>
            <el-col :xs="24">
            <el-form-item label="Ⅲ级应对措施_PM：">
              <el-input v-model="form.measures3_pm" placeholder="请输入" :readonly="type == 'view'" type="textarea" />
            </el-form-item>
            </el-col>
            <el-col :xs="24">
            <el-form-item label="Ⅲ级应对措施_NOx：">
              <el-input v-model="form.measures3_nox" placeholder="请输入" :readonly="type == 'view'" type="textarea" />
            </el-form-item>
            </el-col>
            <el-col :xs="24">
            <el-form-item label="Ⅲ级应对措施_O₃：">
              <el-input v-model="form.measures3_o3" placeholder="请输入" :readonly="type == 'view'" type="textarea" />
            </el-form-item>
            </el-col>
            <template v-if="type != 'add'">
            <el-col :xs="24">
              <h3 class="align-center">更新信息</h3>
            </el-col>
            <el-col :xs="24" :sm="12">
            <el-form-item label="最后更新日期：">
              <div>{{form.update_time}}</div>
            </el-form-item>
            </el-col>
            <el-col :xs="24" :sm="12">
            <el-form-item label="最后更新人：">
              <div>{{form.last_editor}}</div>
            </el-form-item>
            </el-col>
          </template>
          </el-row>
        </el-form>
      </el-scrollbar>
    </div>
    <div class="btn-group align-center p-a-14">
      <el-button size="small" @click="isShow = false">{{type == 'view' ? '关闭' : '取消'}}</el-button>
      <el-button :loading="btnLoading" size="small" type="primary" @click="submitForm" v-if="type != 'view'">保存</el-button>
    </div>
  </el-drawer>
</template>
<script>
import editMixins from './editMixins';
import Treeselect from '@riophae/vue-treeselect'
import '@riophae/vue-treeselect/dist/vue-treeselect.css'
export default {
  mixins: [editMixins],
  components: { Treeselect },
  methods:{
    initCallback(){
      if(this.type == 'add'){
        this.form.class="工业源";
        this.title = '新增工业源';
      }else{
        this.changeEmissions(this.form.so2, 'so2');
        this.changeEmissions(this.form.nox, 'nox');
        this.changeEmissions(this.form.vocs, 'vocs');
        this.changeEmissions(this.form.pm10, 'pm10');
        this.changeEmissions(this.form.pm25, 'pm25');
        this.initType();
      }
      
    },
    initType(){
      let obj4 = this.initData.allIndustries.find(item => item.value4 == this.form.indcode_level4);
      this.indLabel = obj4.id;
    },
    selectType(val){
      this.form.indtype_level4 = val.text;
      this.form.indcode_level4 = val.value4;
      let len = val.value.length;
      let obj;
      if(len == 2){
        obj = this.initData.allIndustries.find(item => item.id == val.parentId);
      }else if(len > 2){
        obj = this.initData.allIndustries.find(item => item.value == val.value.substring(0,2));
      }
      this.form.indtype_level2 = obj.text;
      this.form.indcode_level2 = obj.value;
    },
    verifyForm(){
      if(!this.$verify.null(this.form.name, '请填写污染源名称')){
        return false;
      }
      //经度[113-115]
      if(Number(this.form.lon) < 113 || Number(this.form.lon) > 115){
        this.$message.warning('经度须在113-115之间')
        return false;
      }
      //纬度[21-23]
      if(Number(this.form.lat) < 21 || Number(this.form.lat) > 23){
        this.$message.warning('纬度须在21-23之间')
        return false;
      }
      if(!this.$verify.null(this.form.country, '请选择所属区县')){
        return false;
      }
      if(!this.$verify.null(this.form.indcode_level4, '请选择国民经济行业代码（4级）')){
        return false;
      }
      return true;
    },
  }
}
</script>